/*---------------------------------------------------------------------------------------------
 *  Copyright (c) Microsoft Corporation. All rights reserved.
 *  Licensed under the MIT License. See License.txt in the project root for license information.
 *--------------------------------------------------------------------------------------------*/

.monaco-editor .interactive-editor {
	z-index: 100;
	color: inherit;
	padding: 6px;
	border-radius: 6px;
	border: 1px solid var(--vscode-interactiveEditor-border);
	box-shadow: 0 4px 8px var(--vscode-interactiveEditor-shadow);
}

/* body */

.monaco-editor .interactive-editor .body {
	display: flex;
}

.monaco-editor .interactive-editor .body .content {
	display: flex;
	box-sizing: border-box;
	border-radius: 2px;
	border: 1px solid var(--vscode-interactiveEditorInput-border);
}

.monaco-editor .interactive-editor .body .content.synthetic-focus {
	outline: 1px solid var(--vscode-interactiveEditorInput-focusBorder);
}

.monaco-editor .interactive-editor .body .content .input {
	padding: 2px 2px 2px 4px;
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
	background-color: var(--vscode-interactiveEditorInput-background);
	cursor: text;
}

.monaco-editor .interactive-editor .monaco-editor-background {
	background-color: var(--vscode-interactiveEditorInput-background);
}

.monaco-editor .interactive-editor .body .content .input .editor-placeholder {
	position: absolute;
	z-index: 1;
	padding: 3px 0 0 0;
	color: var(--vscode-interactiveEditorInput-placeholderForeground);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.monaco-editor .interactive-editor .body .content .input .editor-placeholder.hidden {
	display: none;
}

.monaco-editor .interactive-editor .body .content .input .editor-container {
	vertical-align: middle;
}
.monaco-editor .interactive-editor .body .toolbar {
	display: flex;
	flex-direction: column;
	align-self: stretch;
	padding-right: 4px;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 2px;
	background: var(--vscode-interactiveEditorInput-background);
}

.monaco-editor .interactive-editor .body .toolbar .actions-container {
	display: flex;
	flex-direction: row;
	gap: 4px;
}

/* progress bit */

.monaco-editor .interactive-editor .progress {
	position: relative;
	width: calc(100% - 18px);
	left: 19px;
}

/* UGLY - fighting against workbench styles */
.monaco-workbench .part.editor > .content .monaco-editor .interactive-editor .progress .monaco-progress-container {
	top: 0;
}

/* status */

.monaco-editor .interactive-editor .status {
	padding: 6px 0px 2px 0px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.monaco-editor .interactive-editor.preview .status {
	flex-direction: row-reverse;
}

.monaco-editor .interactive-editor .status .actions.hidden {
	display: none;
}

.monaco-editor .interactive-editor .status .label {
	font-size: 12px;
}

.monaco-editor .interactive-editor .status .label A {
	color: var(--vscode-textLink-foreground);
	cursor: pointer;
}

.monaco-editor .interactive-editor .status .label.error {
	color: var(--vscode-errorForeground);
}

.monaco-editor .interactive-editor .status .label.warn {
	color: var(--vscode-editorWarning-foreground);
}

.monaco-editor .interactive-editor .status .monaco-toolbar .action-item {
	padding: 0 2px;
}

.monaco-editor .interactive-editor .status .monaco-toolbar .action-label.checked {
	color: var(--vscode-inputOption-activeForeground);
	background-color: var(--vscode-inputOption-activeBackground);
	outline: 1px solid var(--vscode-inputOption-activeBorder);
}

/* preview */

.monaco-editor .interactive-editor .preview {
	display: none;
}

.monaco-editor .interactive-editor.preview .preview {
	display: inherit;
	padding: 6px;
	border: 1px solid var(--vscode-interactiveEditor-border);
	border-top: none;
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	margin: 0 2px 6px 2px;
}

/* decoration styles */

.monaco-editor .interactive-editor-lines-deleted-range-inline {
	text-decoration: line-through;
	background-color: var(--vscode-diffEditor-removedTextBackground);
	opacity: 0.6;
}
.monaco-editor .interactive-editor-lines-inserted-range {
	background-color: var(--vscode-diffEditor-insertedTextBackground);
}

.monaco-editor .interactive-editor-block-selection {
	background-color: var(--vscode-interactiveEditor-regionHighlight);
}

.monaco-editor .interactive-editor-slash-command {
	color: var(--vscode-textLink-foreground)
}

.monaco-editor .interactive-editor-slash-command-detail {
	opacity: 0.5;
}
